<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">

<!-- 顶部  start -->
<div class="big-header-banner" th:fragment="nav">
    <div id="header" class="page-header sticky">
        <div class="navbar navbar-expand-md">
            <div class="container-fluid p-0">

                <a href="" class="navbar-brand d-md-none" title="凝夜紫导航">
                    <img th:src="@{/images/left-menu/logo80.png}" class="logo-light"
                         alt="凝夜紫导航">
                    <img th:src="@{/images/left-menu/logo80.png}" class="logo-dark d-none"
                         alt="凝夜紫导航">
                </a>

                <div class="collapse navbar-collapse order-2 order-md-1">
                    <div class="header-mini-btn">
                        <label>
                            <input id="mini-button" type="checkbox">
                            <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
                                <path class="line--1" d="M0 40h62c18 0 18-20-17 5L31 55"></path>
                                <path class="line--2" d="M0 50h80"></path>
                                <path class="line--3" d="M0 60h62c18 0 18 20-17-5L31 45"></path>
                            </svg>
                        </label>

                    </div>

                    <ul class="navbar-nav site-menu" style="margin-right: 16px;">
                        <li id="menu-item-1"
                            class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1">
                            <a href="javascript:;">
                                <i class="fa fa-address-book fa-lg mr-2"></i>
                                <span>首页</span></a>
                        </li>
                        <li id="menu-item-2"
                            class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2"><a
                                target="_blank" rel="noopener" href="https://www.yuque.com/ningyezi">
                            <i class="fa fa-file-word-o fa-lg mr-2"></i>
                            <span>语雀</span></a>
                        </li>
                        <li id="menu-item-3"
                            class="menu-item menu-item-type-custom menu-item-object-custom menu-item-3"><a
                                target="_blank" rel="noopener" href="https://www.wjzhang.cn/ctool">
                            <i class="fa fa-gear fa-lg mr-2"></i>
                            <span>站长工具</span></a>
                        </li>
                        <li id="menu-item-4"
                            class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4"><a
                                target="_blank" rel="noopener" href="https://www.wjzhang.cn/alist">
                            <i class="fa fa-globe fa-lg mr-2"></i>
                            <span>网盘</span></a>
                        </li>
                        <li id="menu-item-5"
                            class="menu-item menu-item-type-custom menu-item-object-custom menu-item-5"><a
                                target="_blank" rel="noopener" href="http://www.wjzhang.cn:8080">
                            <i class="fa fa-wifi fa-lg mr-2"></i>
                            <span>NPS</span></a>
                        </li>
                        <li id="menu-item-6"
                            class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6"><a
                                target="_blank" rel="noopener"
                                href="http://sighttp.qq.com/authd?IDKEY=9c5b4a57697d594d085a913f0ffd762a602561527891d8da">
                            <i class="fa fa-qq fa-lg mr-2"></i>
                            <span>QQ</span></a>
                        </li>
                        <li id="menu-item-9"
                            class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-9">
                            <a href="about.html">
                                <i class="fa fa-info-circle fa-lg mr-2"></i>
                                <span>关于</span></a>
                            <ul class="sub-menu">
<!--                                <li id="menu-item-9-1"-->
<!--                                    class="menu-item menu-item-type-post_type menu-item-object-page menu-item-9-1">-->
<!--                                    <a href="https://weibo.com/hiliutongxu">所长微博</a>-->
<!--                                </li>-->
                                <li id="menu-item-9-2"
                                    class="menu-item menu-item-type-custom menu-item-object-custom menu-item-9-2">
                                    <a href="#">关于导航</a>
                                </li>
                            </ul>
                        </li>

                    </ul>
                    <div class="rounded-circle weather">
                        <div id="he-plugin-simple" style="display: contents;"></div>
                        <script>WIDGET = {
                            CONFIG: {
                                "modules": "12034",
                                "background": 5,
                                "tmpColor": "E4C600",
                                "tmpSize": 14,
                                "cityColor": "E4C600",
                                "citySize": 14,
                                "aqiColor": "#E4C600",
                                "aqiSize": 14,
                                "weatherIconSize": 24,
                                "alertIconSize": 18,
                                "padding": "10px 10px 10px 10px",
                                "shadow": "1",
                                "language": "auto",
                                "borderRadius": 5,
                                "fixed": "false",
                                "vertical": "middle",
                                "horizontal": "left",
                                "key": "58d60a29f06b4090bdc4f3fede2a3d5a"
                            }
                        }
                        </script>
                        <script src="https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0"></script>
                    </div>
                </div>

                <ul class="nav navbar-menu text-xs order-1 order-md-2">
                    <!-- 一言 -->
                    <li class="nav-item mr-3 mr-lg-0 d-none d-lg-block">
                        <script>
                            fetch('https://v1.hitokoto.cn')
                                .then(response => response.json())
                                .then(data => {
                                    const hitokoto = document.getElementById('hitokoto_text')
                                    hitokoto.href = 'https://hitokoto.cn/?uuid=' + data.uuid
                                    hitokoto.innerText = data.hitokoto
                                })
                                .catch(console.error)
                        </script>
                        <div id="hitokoto"><a href="#" target="_blank" id="hitokoto_text">无他，唯手熟尔</a></div>
                    </li>
                    <!-- 一言 end -->
                    <li class="nav-search ml-3 ml-md-4">
                        <a href="javascript:" data-toggle="modal" data-target="#search-modal"><i
                                class="iconfont icon-search icon-2x"></i></a>
                    </li>
                    <li class="nav-item d-md-none mobile-menu ml-3 ml-md-4">
                        <a href="javascript:" id="sidebar-switch" data-toggle="modal"
                           data-target="#sidebar"><i class="iconfont icon-classification icon-2x"></i></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="placeholder" style="height:74px"></div>
</div>
<!-- 顶部  end -->

</html>
